<!--

  内容区外贸管理
  
-->

<template>
    <div class="contain">
       <el-row >
  
                   <el-button type="primary"
                    plain class="aa"
                    
                     >报价单</el-button>
                   <el-button type="success" plain>统计分析</el-button>
                   <el-button type="info" plain>合同进程表</el-button>
                   <el-button type="warning" plain>收汇</el-button>
                   <el-button type="danger" plain>开票</el-button>
                 
 </el-row>
  <div class="tu">
            <img   class="w1" src="../../assets/green/four-black.png" />
              <img   class="w1 w2" src="../../assets/green/four-green.png" />
                <img   class="w1 w3" src="../../assets/green/four-black.png" />
                  <img   class="w1 w4" src="../../assets/green/four-green.png" />

<Fontsize title="请假登记" distance="17.5%"  km="32.5%" />
    <Fontsize title="出差登记" distance="34.6%"  km="32.5%"/>
    <Fontsize title="调休补班" distance="51.7%" km="32.5%"/>
    <Fontsize title="考勤管理" distance="69%" km="32.5%"/>


        <div class="waimao-text">
            <span class="waimao-text-title">Dummy&nbsp;Title<br>
                Dummy&nbsp;Title<br>
                Dummy&nbsp;Title<br>
                </span>
       </div>
             <div class="waimao-text a1">
            <span class="waimao-text-title">Dummy&nbsp;Title<br>
                Dummy&nbsp;Title<br>
                Dummy&nbsp;Title<br>
                </span>
       </div>
         <div class="waimao-text a2">
            <span class="waimao-text-title ">Dummy&nbsp;Title<br>
                Dummy&nbsp;Title<br>
                Dummy&nbsp;Title<br>
                </span>
       </div>
        <div class="waimao-text a3">
            <span class="waimao-text-title">Dummy&nbsp;Title<br>
                Dummy&nbsp;Title<br>
                Dummy&nbsp;Title<br>
                </span>
       </div>
    </div>
    

    </div>
</template>

<script>
import Fontsize from '../Fontsize'
export default {
     components:{
        Fontsize
    }
}
</script>

<style lang="scss" scoped>
    .contain{
        height: 100%;
    }
    .aa{
        margin-left:60px
    }
  .el-button{
       margin-top: 20px;
    color: #b0b0b0;
    background: #5a5a5a;
    border-color: #5a5a5a;
        transition: 1.1s;
   }
    .tu{
    position: relative;
    height: 88%;
    width:72%;
    }
    .w1{
        position: absolute;
    top: 25%;
    left: 15%;
    height: 25.216%;
    width: 14.064%;
    cursor: pointer;
    }
    .w2{
        left: 32%;
    }
     .w3{
        left: 49%;
    }
     .w4{
        left: 66%;
    }
    .waimao-text{
    position: absolute;
    left: 17%;
    bottom: 16%;
    height: 21%;
    width: 9%;
   color: #736e72;
    font-family: unset;
    line-height: 30px;
    &-title{
 font-size: 17px;
     }
    }
    .a1{
        left:34%;
    }
     .a2{
        left:51%;
    }
     .a3{
        left:68%;
    }
</style>
